<!-- 意见反馈 -->
<template>
  <div class="feedback-main">
    <Navbar :title="title" />
    <van-form @submit="onSubmit">
      <van-field
        v-model="message"
        type="textarea"
        name="留言"
        label="留言"
        placeholder="请填写你的意见和反馈"
        :rules="[{ required: true, message: '请填写您的意见' }]"
      />
      <van-field
        v-model="contact"
        name="联系方式"
        label="联系方式"
        placeholder="手机号/邮箱/微信号"
        :rules="[{ required: true, message: '请正确输入填写内容' }]"
      />
      <div style="margin: 16px">
        <van-button
          square
          color="#B4282D"
          block
          type="info"
          native-type="submit"
        >
          提交
        </van-button>
      </div>
    </van-form>
  </div>
</template>

<script>
import Vue from "vue";
import { Form, Field, Button, Toast } from "vant";

Vue.use(Form).use(Field).use(Button).use(Toast);
import Navbar from "@/components/Navbar";
import feedbackApi from "@/api/feedback/index";
export default {
  name: "feedback",
  components: {
    Navbar,
  },
  data() {
    return {
      title: "意见反馈",
      message: "",
      contact: "",
    };
  },
  created() {},
  methods: {
    onSubmit() {
     var _this=this
      feedbackApi.feedbackSubmit({
          name: "王小二",
          openId: "15845697415",
          content: this.message,
          phone: this.contact,
        })
        .then((res) => {
          if (res.data) {
            Toast({
              message: "成功提交",
              icon: "success",
            });
            setTimeout(() => {
              _this.message = "";
              _this.contact = "";
            }, 2000);
          }
        });
    },
  },
};
</script>
<style lang='scss' scoped>
.feedback-main {
  height: 680px;
  background-color: $bagColor;
  .van-button {
    border-radius: 10px;
  }
}
</style>